{literal}
 	<style type="text/css">	
 	.abaTbl {
		margin-left: 1px;
	}
	
	.abaTbl li {
		list-style: none;
		float: left;
	}
	
	.abaTbl li a {
		text-decoration: none;
		width: 180px;
		height: 100%;
		padding: 2px 5px;
		display: block;
		background-color: #DDD6DA;
		margin: 0 1px;
		text-align: center;
		color: #414042;
	}
	
	.abaTbl li a.ativo {
		background-color: #A47688;
		color: #FFF;
	}
	
	.abaTbl li a:hover {
		text-decoration: underline;
	}
	
	.tblCxAlta {
		text-align: center;
		clear: both;
		width: 95%;
	}
	
	.tblCxAlta th {
		background-color: #932758;
		vertical-align: middle;
		padding: 5px 10px;
		color: #FFF;
		font-weight: normal;
		width: 12%;
	}
	
	.tblCxAlta tbody tr td {
		background-color: #DDD6DA;
		vertical-align: middle;
		padding: 5px;
	}
	
	.tblCxAlta tbody tr.impar td {
		background-color: #EDE8EB;
		vertical-align: middle;
		padding: 5px;
	}
	
	.tblCxAlta tfoot tr td {
		background-color: #932758;
		vertical-align: middle;
		padding: 5px 10px;
		color: #FFF;
	}
	
	.tblCxAlta tr td.legenda {
	    background-color: #DDD6DA;
	    font-size: 12px;
	    text-align: left;
	    color: #414042;
	}
	
	.tblCxAlta tr td.legenda h5 {
	    font-size: 12px;
	    text-align: left;
	    color: #414042;
	    font-weight: normal;
	    padding-left: 5px;
	}
	
	.tblCxAlta tr td.legenda div {
	    float:left;
	    padding-left:5px;  
	    margin-right: 15px;
	}
	
	.tblCxAlta tr td.legenda div span {
	    vertical-align: middle;
	}
	
	.tblCxAlta tr td.legenda div img {
	    vertical-align: middle;
	}
	
	
	.tblCxAlta tr td.legenda {
	    background-color: #DDD6DA;
	    font-size: 12px;
	    text-align: left;
	    color: #414042;
	}
	
	
	.tblCxAlta tr td.info {
		background: none;
		font-size: 12px;
		text-align: left;
		color: #414042;
	}
	</style>
{/literal}


<div class="bgCinzaMedio widthFull floatLeft marginBottom20 labelLaranja">
	<ul class="abaTbl">
		<li><a id="aba_1" href="javascript:trocaTabela('1');" >Saldo Total</a></li>
		<li><a id="aba_2" href="javascript:trocaTabela('2')">Vendas</a></li>
		<li><a id="aba_3" href="javascript:trocaTabela('3')">Resgate</a></li>
	</ul>
	
		<table class="tblCxAlta" id="tab_1">
		<thead>
			<tr>
				<th>Data</th>
				<th>Tipo</th>
				<th>Cliente / Parceiro</th>
				<th>Pontos</th>
				<th>Vencimento</th>
			</tr>
		</thead>
		<tbody>
			{section loop=$arrSaldoUsuario name=cont}
				{if $smarty.section.cont.index mod 2}
					<tr>
				{else}
					<tr class="impar">
				{/if}
					<td>{$arrSaldoUsuario[cont].data_reg}</td>
					<td>
						<img alt="Tipo" src="../imgs/icone_tipo_{$arrSaldoUsuario[cont].tipo}.png">
					</td>
					<td>{$arrSaldoUsuario[cont].nome_cliente_parceiro}</td>
					<td>
						{if $arrSaldoUsuario[cont].tipo != 'V'}
							- 
						{/if}
						{$arrSaldoUsuario[cont].pontos}
					</td>
					<td>{$arrSaldoUsuario[cont].vencimento}</td>
				</tr>
			{sectionelse}
				<tr>
					<td class="textCenter" colspan="5">Nenhum registro encontrado.</td>
				</tr>
			{/section}
		</tbody>
		<tfoot>
			<tr>
				<td colspan="4" class="legenda">
					<h5>LEGENDA</h5>				
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_V.png">
						<span>&nbsp;Venda</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_1.png">
						<span>&nbsp;Resgate</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_E.png">
						<span>&nbsp;Ponto Expirado</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_C.png">
						<span>&nbsp;Ponto/Pedido Cancelado</span> 
					</div>
				</td>
				<td>Saldo Total<br/> {$saldo_total_usuario} pontos</td>
			</tr>
		</tfoot>		

	</table>
	
	
	
	<table class="tblCxAlta" id="tab_2">
		<thead>
			<tr>
				<th>Data da Venda</th>
				<th>Pedido</th>
				<th>Tipo</th>
				<th>Cliente / Parceiro</th>
				<th>Valor da Venda</th>
				<th>Valor Líquido<br /> da Venda</th>
				<th>Data da Entrega</th>
				<th>Valor <br /> Reserva Técnica</th>
				<th>Data Pagamento <br />Reserva Técnica</th>
				<th>Pontos</th>
			</tr>
		</thead>
		<tbody>
			{section loop=$arrHistoricoVendas name=cont}
				{if $smarty.section.cont.index mod 2}
					<tr>
				{else}
					<tr class="impar">
				{/if}
					<td>{$arrHistoricoVendas[cont].data_venda}</td>
					<td>{$arrHistoricoVendas[cont].cod_venda}</td>
					<td>
						<img alt="Tipo" src="../imgs/icone_tipo_{$arrHistoricoVendas[cont].tipo}.png">
					</td>
					<td>{$arrHistoricoVendas[cont].nome_cliente}</td>
					<td>
						{if $arrHistoricoVendas[cont].tipo != 'V'}
							- 
						{/if}
						R$ {$arrHistoricoVendas[cont].valor_venda}
					</td>
					<td>
						{if $arrHistoricoVendas[cont].tipo != 'V'}
							- 
						{/if}
						R$ {$arrHistoricoVendas[cont].valor_liquido}
					</td>
					<td>{$arrHistoricoVendas[cont].data_entrega}</td>
					<td>
						{if $arrHistoricoVendas[cont].tipo != 'V'}
							- 
						{/if}						
						R$ {$arrHistoricoVendas[cont].valor_reserva_tec}
					</td>
					<td>{$arrHistoricoVendas[cont].data_pgto_reserva_tec}</td>
					<td>
						{if $arrHistoricoVendas[cont].tipo != 'V'}
							- 
						{/if}
						{$arrHistoricoVendas[cont].qtd_pontos}
					</td>
				</tr>
			{sectionelse}
				<tr>
					<td class="textCenter" colspan="10">Nenhum registro encontrado.</td>
				</tr>
			{/section}
		</tbody>
		<tfoot>
			<tr>
				<td colspan="8" class="legenda">
					<h5>LEGENDA</h5>				
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_V.png">
						<span>&nbsp;Venda</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_1.png">
						<span>&nbsp;Resgate</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_E.png">
						<span>&nbsp;Ponto Expirado</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_C.png">
						<span>&nbsp;Ponto/Pedido Cancelado</span> 
					</div>
				</td>
				<td colspan="2">Total<br/>{$totalPontosHistoricoVendas} pontos</td>
			</tr>
		</tfoot>
	</table>
	
	
	
	<table class="tblCxAlta" id="tab_3">
		<thead>
			<tr>
				<th>Data</th>
				<th>Tipo</th>
				<th>Prêmio</th>
				<th>Situação</th>
				<th>Pontos</th>
			</tr>
		</thead>
		<tbody>
			{section loop=$arrVouchersEmitidos name=cont}
				{if $smarty.section.cont.index mod 2}
					<tr>
				{else}
					<tr class="impar">
				{/if}
					<td>{$arrVouchersEmitidos[cont].data_voucher}</td>
					<td>
						<img alt="Tipo" src="../imgs/icone_tipo_1.png">
					</td>
					<td>{$arrVouchersEmitidos[cont].titulo_premio}</td>
					<td>
					{ if $arrVouchersEmitidos[cont].status_voucher == 1}
						VOUCHER EM ABERTO
					{/if}
					{ if $arrVouchersEmitidos[cont].status_voucher == 2}
						VOUCHER UTILIZADO
					{/if}
					</td>
					<td>{$arrVouchersEmitidos[cont].pontos_premio} pontos</td>
				</tr>
			{sectionelse}
				<tr>
					<td class="textCenter" colspan="5">Nenhum registro encontrado.</td>
				</tr>
			{/section}
		</tbody>
		<tfoot>
			<tr>
				<td colspan="4" class="legenda">
					<h5>LEGENDA</h5>				
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_V.png">
						<span>&nbsp;Venda</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_1.png">
						<span>&nbsp;Resgate</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_E.png">
						<span>&nbsp;Ponto Expirado</span> 
					</div>
					<div>
						<img alt="Tipo" src="../imgs/icone_tipo_C.png">
						<span>&nbsp;Ponto/Pedido Cancelado</span> 
					</div>
				</td>
				<td>Total<br/> {$totalPontosResgatados} pontos</td>
			</tr>
		</tfoot>
	</table>
</div>
{literal}
	<script type="text/javascript">
		function trocaTabela(numeroTabela) {
			for (count=1; count<=3; count++){
				document.getElementById('tab_'+count).style.display = 'none';
				document.getElementById('aba_'+count).style.backgroundColor = '#DDD6DA';
				document.getElementById('aba_'+count).style.color = '#414042';
			}

			document.getElementById('tab_'+numeroTabela).style.display = 'block';
			document.getElementById('aba_'+numeroTabela).style.backgroundColor = '#932758';
			document.getElementById('aba_'+numeroTabela).style.color = '#FFFFFF';
		}
		trocaTabela('1');
	</script>
{/literal}
</div>

		